<template>
  <div class="management">
    <el-tabs type="border-card" v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="新增学员数" name="first">
        <div>
          <p class="changeTime" v-if="flag">
            <span :class="flag==1?'active':''" @click="handleWeek">本周</span>
            <span :class="flag==2?'active':''" @click="handleMonth">本月</span>
            <span :class="flag==3?'active':''" @click="handleYear">本年</span>
          </p>
          <week ref="chart" v-if="activeName=='first'"></week>
        </div>
      </el-tab-pane>
      <el-tab-pane label="新开班级数" name="second">
        <div>
          <p class="changeTime" v-if="flag">
            <span :class="flag==1?'active':''" @click="handleWeek">本周</span>
            <span :class="flag==2?'active':''" @click="handleMonth">本月</span>
            <span :class="flag==3?'active':''" @click="handleYear">本年</span>
          </p>
          <week ref="chart" v-if="activeName=='second'"></week>
        </div>
      </el-tab-pane>
      <el-tab-pane label="学员课时完成数" name="third">
        <div>
          <p class="changeTime" v-if="flag">
            <span :class="flag==1?'active':''" @click="handleWeek">本周</span>
            <span :class="flag==2?'active':''" @click="handleMonth">本月</span>
            <span :class="flag==3?'active':''" @click="handleYear">本年</span>
          </p>
          <week ref="chart" v-if="activeName=='third'"></week>
        </div>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import moment from "moment";
import week from "../../../components/echarts/week.vue";
export default {
  name: "management",
  data() {
    return {
      activeName: "first",
      flag: 1,
      newstudent: [],
      week: {},
      month: {},
      year: {},
      weeknum: [],
      weekobj: []
    };
  },
  components: {
    week
  },
  methods: {
    handleClick(tab, event) {
      console.log(tab, event);
      if (tab.name == "first") {
        this.flag = 1;
        const num = Date.now();
        const day = new Date().getDay();
        this.week = {
          from: new Date(
            num - 60 * 60 * 24 * ((day ? day : 7) - 1) * 1000
          ).toLocaleDateString(),
          to: num
        };
        this.$axios({
          method: "post",
          url: "/v4/backAdmin/selectschoolchangestudent",
          xsrfCookieName: "csrfToken", // default
          xsrfHeaderName: "x-csrf-token", // 默认的
          data: {
            starttime: this.week.from,
            endtime: this.week.to,
            schoolid: this.$route.params.ID
          }
        })
          .then(data => {
            console.log(data.data.data);
            this.newstudent = data.data.data;
            this.$refs.chart.creatdata(this.newstudent, "周", "createdAt");
          })
          .catch(err => {
            console.log(err);
          });
      }
      if (tab.name == "second") {
        this.flag = 1;
        const num = Date.now();
        const day = new Date().getDay();
        this.week = {
          from: new Date(
            num - 60 * 60 * 24 * ((day ? day : 7) - 1) * 1000
          ).toLocaleDateString(),
          to: num
        };
        this.$axios({
          method: "post",
          url: "/v4/backAdmin/getschoolclazz",
          xsrfCookieName: "csrfToken", // default
          xsrfHeaderName: "x-csrf-token", // 默认的
          data: {
            starttime: this.week.from,
            endtime: this.week.to,
            schoolid: this.$route.params.ID
          }
        })
          .then(data => {
            console.log(data.data.data);
            this.newstudent = data.data.data;
            this.$refs.chart.creatdata(this.newstudent, "周", "createdAt");
          })
          .catch(err => {
            console.log(err);
          });
      }
      if (tab.name == "third") {
        this.flag = 1;
        const num = Date.now();
        const day = new Date().getDay();
        this.week = {
          from: new Date(
            num - 60 * 60 * 24 * ((day ? day : 7) - 1) * 1000
          ).toLocaleDateString(),
          to: num
        };
        this.$axios({
          method: "post",
          url: "/v4/backAdmin/selectschoolchangestudentcalendar",
          xsrfCookieName: "csrfToken", // default
          xsrfHeaderName: "x-csrf-token", // 默认的
          data: {
            starttime: this.week.from,
            endtime: this.week.to,
            schoolid: this.$route.params.ID
          }
        })
          .then(data => {
            console.log(data.data.data);
            this.newstudent = data.data.data;
            this.$refs.chart.creatdata(this.newstudent, "周", "createdAt");
          })
          .catch(err => {
            console.log(err);
          });
      }
    },
    handleWeek() {
      this.flag = 1;

      if (this.activeName == "first") {
        const num = Date.now();
        const day = new Date().getDay();
        this.week = {
          from: new Date(
            num - 60 * 60 * 24 * ((day ? day : 7) - 1) * 1000
          ).toLocaleDateString(),
          to: num
        };
        this.$axios({
          method: "post",
          url: "/v4/backAdmin/selectschoolchangestudent",
          xsrfCookieName: "csrfToken", // default
          xsrfHeaderName: "x-csrf-token", // 默认的
          data: {
            starttime: this.week.from,
            endtime: this.week.to,
            schoolid: this.$route.params.ID
          }
        })
          .then(data => {
            console.log(data.data.data);
            this.newstudent = data.data.data;
            this.$refs.chart.creatdata(this.newstudent, "周", "createdAt");
          })
          .catch(err => {
            console.log(err);
          });
      }
      if (this.activeName == "second") {
        const num = Date.now();
        const day = new Date().getDay();
        this.week = {
          from: new Date(
            num - 60 * 60 * 24 * ((day ? day : 7) - 1) * 1000
          ).toLocaleDateString(),
          to: num
        };
        this.$axios({
          method: "post",
          url: "/v4/backAdmin/getschoolclazz",
          xsrfCookieName: "csrfToken", // default
          xsrfHeaderName: "x-csrf-token", // 默认的
          data: {
            starttime: this.week.from,
            endtime: this.week.to,
            schoolid: this.$route.params.ID
          }
        })
          .then(data => {
            console.log(data.data.data);
            this.newstudent = data.data.data;
            this.$refs.chart.creatdata(this.newstudent, "周", "createdAt");
          })
          .catch(err => {
            console.log(err);
          });
      }
      if (this.activeName == "third") {
        const num = Date.now();
        const day = new Date().getDay();
        this.week = {
          from: new Date(
            num - 60 * 60 * 24 * ((day ? day : 7) - 1) * 1000
          ).toLocaleDateString(),
          to: num
        };
        this.$axios({
          method: "post",
          url: "/v4/backAdmin/selectschoolchangestudentcalendar",
          xsrfCookieName: "csrfToken", // default
          xsrfHeaderName: "x-csrf-token", // 默认的
          data: {
            starttime: this.week.from,
            endtime: this.week.to,
            schoolid: this.$route.params.ID
          }
        })
          .then(data => {
            console.log(data.data.data);
            this.newstudent = data.data.data;
            this.$refs.chart.creatdata(this.newstudent, "周", "createdAt");
          })
          .catch(err => {
            console.log(err);
          });
      }
    },
    handleMonth() {
      this.flag = 2;
      if (this.activeName == "first") {
        const num = Date.now();
        const date = new Date().getDate();
        this.month = {
          from: new Date(
            num - 60 * 60 * 24 * (date - 1) * 1000
          ).toLocaleDateString(),
          to: num
        };
        this.$axios({
          method: "post",
          url: "/v4/backAdmin/selectschoolchangestudent",
          xsrfCookieName: "csrfToken", // default
          xsrfHeaderName: "x-csrf-token", // 默认的
          data: {
            starttime: this.month.from,
            endtime: this.month.to,
            schoolid: this.$route.params.ID
          }
        })
          .then(data => {
            console.log(data.data.data);
            this.newstudent = data.data.data;
            const day = moment()
              .endOf("month")
              .format("DD");
            this.$refs.chart.creatdata(this.newstudent, "月", "createdAt", day);
          })
          .catch(err => {
            console.log(err);
          });
      }
      if (this.activeName == "second") {
        const num = Date.now();
        const date = new Date().getDate();
        this.month = {
          from: new Date(
            num - 60 * 60 * 24 * (date - 1) * 1000
          ).toLocaleDateString(),
          to: num
        };
        this.$axios({
          method: "post",
          url: "/v4/backAdmin/getschoolclazz",
          xsrfCookieName: "csrfToken", // default
          xsrfHeaderName: "x-csrf-token", // 默认的
          data: {
            starttime: this.month.from,
            endtime: this.month.to,
            schoolid: this.$route.params.ID
          }
        })
          .then(data => {
            console.log(data.data.data);
            this.newstudent = data.data.data;
            const day = moment()
              .endOf("month")
              .format("DD");
            this.$refs.chart.creatdata(this.newstudent, "月", "createdAt", day);
          })
          .catch(err => {
            console.log(err);
          });
      }
      if (this.activeName == "third") {
        const num = Date.now();
        const date = new Date().getDate();
        this.month = {
          from: new Date(
            num - 60 * 60 * 24 * (date - 1) * 1000
          ).toLocaleDateString(),
          to: num
        };
        this.$axios({
          method: "post",
          url: "/v4/backAdmin/getschoolitembankgetschoolitembank",
          xsrfCookieName: "csrfToken", // default
          xsrfHeaderName: "x-csrf-token", // 默认的
          data: {
            starttime: this.month.from,
            endtime: this.month.to,
            schoolid: this.$route.params.ID
          }
        })
          .then(data => {
            console.log(data.data.data);
            this.newstudent = data.data.data;
            const day = moment()
              .endOf("month")
              .format("DD");
            this.$refs.chart.creatdata(this.newstudent, "月", "createdAt", day);
          })
          .catch(err => {
            console.log(err);
          });
      }
    },
    handleYear() {
      this.flag = 3;
      if (this.activeName == "first") {
        const num = Date.now();
        const fromyear = new Date().getFullYear();
        this.year = {
          from: `${fromyear}/1/1`,
          to: num
        };
        this.$axios({
          method: "post",
          url: "/v4/backAdmin/selectschoolchangestudent",
          xsrfCookieName: "csrfToken", // default
          xsrfHeaderName: "x-csrf-token", // 默认的
          data: {
            starttime: this.year.from,
            endtime: this.year.to,
            schoolid: this.$route.params.ID
          }
        })
          .then(data => {
            console.log(data.data.data);
            this.newstudent = data.data.data;
            this.$refs.chart.creatdata(this.newstudent, "年", "createdAt");
          })
          .catch(err => {
            console.log(err);
          });
      }
      if (this.activeName == "second") {
        const num = Date.now();
        const fromyear = new Date().getFullYear();
        this.year = {
          from: `${fromyear}/1/1`,
          to: num
        };
        this.$axios({
          method: "post",
          url: "/v4/backAdmin/getschoolclazz",
          xsrfCookieName: "csrfToken", // default
          xsrfHeaderName: "x-csrf-token", // 默认的
          data: {
            starttime: this.year.from,
            endtime: this.year.to,
            schoolid: this.$route.params.ID
          }
        })
          .then(data => {
            console.log(data.data.data);
            this.newstudent = data.data.data;
            this.$refs.chart.creatdata(this.newstudent, "年", "createdAt");
          })
          .catch(err => {
            console.log(err);
          });
      }
      if (this.activeName == "third") {
        const num = Date.now();
        const fromyear = new Date().getFullYear();
        this.year = {
          from: `${fromyear}/1/1`,
          to: num
        };
        this.$axios({
          method: "post",
          url: "/v4/backAdmin/getschoolitembankgetschoolitembank",
          xsrfCookieName: "csrfToken", // default
          xsrfHeaderName: "x-csrf-token", // 默认的
          data: {
            starttime: this.year.from,
            endtime: this.year.to,
            schoolid: this.$route.params.ID
          }
        })
          .then(data => {
            console.log(data.data.data);
            this.newstudent = data.data.data;
            this.$refs.chart.creatdata(this.newstudent, "年", "createdAt");
          })
          .catch(err => {
            console.log(err);
          });
      }
    }
  },
  created() {
    const num = Date.now();
    const day = new Date().getDay();
    this.week = {
      from: new Date(
        num - 60 * 60 * 24 * ((day ? day : 7) - 1) * 1000
      ).toLocaleDateString(),
      to: num
    };
    this.$axios({
      method: "post",
      url: "/v4/backAdmin/selectschoolchangestudent",
      xsrfCookieName: "csrfToken", // default
      xsrfHeaderName: "x-csrf-token", // 默认的
      data: {
        starttime: this.week.from,
        endtime: this.week.to,
        schoolid: this.$route.params.ID
      }
    })
      .then(data => {
        console.log(data.data.data);
        this.newstudent = data.data.data;
        this.$refs.chart.creatdata(this.newstudent, "周", "createdAt");
      })
      .catch(err => {
        console.log(err);
      });
  }
};
</script>

<style scoped>
#myChart {
  width: 1150px;
  height: 450px;
}
.changeTime span {
  padding: 0 10px;
  cursor: pointer;
}
.active {
  color: #409eff;
}
</style>